
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>添加出差记录</title>
<!-- BootStrap -->
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet"
	href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>

<!-- easy UI -->
<link rel="stylesheet" type="text/css"
	href="../themes/bootstrap/easyui.css">
<link rel="stylesheet" type="text/css" href="../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../themes/color.css">
<script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../js/easyui-lang-zh_CN.js"></script>
</head>
<script type="text/javascript">
	$(function(){
		$('#date').datebox({    
		}); 
		$('#uid input:text').attr("readonly","readonly");
		$("#uname").blur(function(){
			if ($("#uname").val() == "") {
				$.messager.confirm('确认','对不起，姓名的值不能为空？'); 
			}else{
				$.ajax({
					url:'../getUidByUname',
					type:'post',
					dataType:"json",
					data:{
						'uname':$('#uname').val(),
		  			},
					success:function(r){
						if (r.uid != 0) {
							$("input[id='uid']").val(r.uid);
						}else{
							$.messager.show({
								title:'抱歉',
								msg:'对不起，无此员工！',
								timeout:2000,
								showType:'show'
							});
							$("#uname").val("");
						}
					}
				});
			}
		});
		
		$('#btn').click(function(){
			$.ajax({
				url:'../addBtravel',
				type:'post',
				dataType:"json",
				data:{
					'uid':$("input[id='uid']").val(),
					'uname':$('#uname').val(),
					'state':$('#state').val(),
					'time':$('#time').val(),
					'date':$('#date').val(),
					'remark':$('#remark').val(),
				},
				success:function(r){
					if (r.flag) {
						$.messager.confirm('确认','恭喜您，出差记录添加成功',function(r){    
						    if (r){
						    	$("input[id='uid']").val("");
						    	$("#uname").val(""); 
						    	$("#time").val(""); 
						    	$('#date').datebox('clear'); 
						    	$("#remark").val(""); 
						    }    
						}); 
					}
				}
			})
		})
	});
</script>
<body>
	<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
		<div class="container">
			<p class="navbar-text"><h1>添加出差记录:</h1></p>
		</div>
	</nav>
	<div class="container-fluid">
		<div class="row">
			<div class="row">
				<div class="col-md-3"></div>
				<div class="col-md-6" style="margin-top: 100px">
					<div id="uid" class="input-group input-group-lg">
						<span class="input-group-addon" style="width: 100px">uid</span> 
						<input id="uid" type="text" class="form-control" placeholder="UserId" 
						style="width: 550px">
					</div>
					<div class="input-group input-group-lg">
						<span class="input-group-addon" style="width: 100px">uname</span>
						<input id="uname" type="text" class="form-control"
							placeholder="UserName" style="width: 550px">
					</div>
					<div class="input-group input-group-lg">
						<span class="input-group-addon" style="width: 100px">state</span>
						<input id="state" type="text" class="form-control" value='出差'
							style="width: 550px">
					</div>
					<div class="input-group input-group-lg">
						<span class="input-group-addon" style="width: 100px">time</span> <input
							id="time" type="text" class="form-control"
							placeholder="出差时长，单位（天）" style="width: 550px">
					</div>
					<div class="input-group input-group-lg">
						<span class="input-group-addon" style="width: 100px">date</span> <input
							id="date" type="text" class="form-control" 
							style="width: 550px; height: 46px"></input>
					</div>
					<div class="input-group input-group-lg">
						<span class="input-group-addon" style="width: 100px">remark</span>
						<input id="remark" type="text" class="form-control"
							placeholder="备注" style="width: 550px">
					</div>
					<br>
					<button id="btn" type="button"
						class="btn btn-primary btn-lg btn-block">Commit Record</button>
				</div>
				<div class="col-md-3"></div>
			</div>
		</div>
	</div>
</body>
</html>